@charset "utf-8";
/*========css reset========*/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,caption,input {margin:0;padding:0;border:0;outline:0;}
* { box-sizing: border-box;}
body {font-size:12px; color:#565656; font-family: Roboto,sans-serif;}
::-moz-selection {  background-color: #b3d4fc;  color: #000;  text-shadow: none;  }
::selection {  background-color: #b3d4fc;  color: #000;  text-shadow: none;  }
h1,h2,h3,h4,h5,h6 { margin: 0; padding: 0;}
a:link,a:visited,a:hover,a:active,a:focus {text-decoration:none;outline: none;}
a {color:#1a1a1a; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s;  text-decoration:none;}
img {  max-width: 100%; font-size: 0; line-height: 0; }
li { list-style: none;}
:root { --site-color: #00397f; --site-color-light: #00b8d4; --site-width: 1200px; --site-max: 2400px; }

/*========网页端样式 - 快捷样式调用========*/
body { background-color:#ffffff; min-height:100%; margin: 0; padding: 0; color: #333;}
a { color: #3c4570;}
a:hover {color:#545d89;}
.animated {  -webkit-animation-duration:0.5s;  animation-duration:0.5s  }
.animate { -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; }
.page_max { max-width: var(--site-max); margin: 0 auto;}
.d-inline-block { display: inline-block;}
.fully { width: 1200px; width: var(--site-width); margin-left: auto; margin-right: auto;}
.bg_primary { background-color: var(--site-color)}
.text_primary { color: var(--site-color)}
.bg-site { background-color: #f4f4f4;}
.xs_hide { display: block;}
.xs_show { display: none;}

.block_padding { padding: 50px 0;}
.box-center { margin:0 auto;}
.border_bottom { border-bottom: 1px solid #e7e7e7;}
.border_bottom:last-child { border-bottom: none}
.bottom-gradient {  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, transparent 72px);  }
.primary_button { display: inline-block; color: #fff!important; border: 0; padding: 0.8em 1.6em; line-height: 1em; background-color: #0079ff; border-radius: 6px; cursor: pointer;}
.outline_button { display: inline-block; color: #0079ff!important; border: 1px solid #0079ff; padding: 0.8em 1.6em; line-height: 1em; background-color: #ffffff; border-radius: 6px; cursor: pointer;}
.outline_button.round { border-radius: 2em;}
.clear {content:".";display:block;clear:both;height:0; font-size:0px;visibility:hidden;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{}
.relative { position: relative;}


.swiper-slide>a>div { height: 20px; line-height: 20px; overflow: hidden;}

/*index*/

#app_framework { }
    .top_wrapper { position: relative;}
    .top_wrapper:after{ content: ''; position: absolute; left: 50%; bottom: 0; width: 100%; transform: translateX(-50%); max-width: 1899px; background: linear-gradient(to right , #000 0% , rgba(255,255,255, 0.8) 20%, rgba(255,255,255, 0.8) 80%, #000 100%) ; height: 2px;}
    .top_logo { padding: 18px 0 18px 0; position: relative;}
        .top_logo_link { }
        .top_logo_link span { position: absolute; left: 85px; bottom: 16px; color: #fff; font-size: 15px; width: 200px;}
    .top_drawer { position: absolute; z-index: 155; right: 10px; top: 10px;}

.logo_contact { height: 32px; position: absolute; right: 280px; top: 50px; }
.logo_contact span { line-height: 32px; display: inline-block; vertical-align: middle;}
.logo_search { width: 260px; height: 32px; background: #fff; position: absolute; right: 0px; top: 50px; border: 1px solid #e7e7e7; border-radius: 26px; padding: 2px 10px;}
.logo_search .sr{display: inline-block; float: left; width: 208px; height: 26px; border: none; color: #000; background: none; padding: 0 10px; font-size:14px; line-height:24px; }
.logo_search .btn{display: inline-block; float: left; width: 26px; height: 26px; border: none; outline: none; background: url(search3.png) no-repeat center; cursor: pointer;}


.top_menu_bg { background: #f2f2f2; height: 66px;}
.top_menu_box { height: 66px; position: relative; z-index: 155; display: flex; justify-content: space-around;}
    .top_menu { display: inline-block; position: relative; padding: 32px 12px; height: 100%; font-size: 0;}
    .top_menu:last-child { background: none;}
    .top_menu .top_menu_item { font-size: 19px; line-height: 1; color: #fff; padding-bottom: 2px; }
        .top_menu_item.active { color: #00eaff; z-index: 2; border-bottom: 1px solid #fff;}

    .submenu { background-color: #fff; width: 180px; position: absolute; top: 110%; left: -25px; left: calc(50% - 90px);   -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: ease-in 0.3s;  z-index: -1; opacity: 0; visibility: hidden; text-align: center; box-shadow: 1px 1px 1px rgba(0,0,0,0.5) }
    .submenu_item > a { color: #333; font-size: 16px; line-height: 1; display: block; padding: 1em 0.5em; border-bottom: 1px dashed #ccc;}
    .submenu_item > a:last-child { border-bottom: none;}
    .submenu_item:hover > a { color: #fff; background-color: #1e79be; position: relative;}
    /*.submenu_item:hover > a:after { content: '>'; position: absolute; right: 5px; height: 100%; line-height: 100%;}*/

    .top_menu:hover .submenu{ top: 100%; opacity: 1; visibility: visible;}

        .three_menu { background-color: #fff; width: 240px; position: absolute; top: 0; left: 90%; -webkit-transition-duration: 0.1s; -moz-transition-duration: 0.1s; -o-transition-duration: 0.1s; transition-duration: ease-in 0.1s; overflow: hidden; z-index: -1; opacity: 0; visibility: hidden; text-align: center; box-shadow: 1px 1px 1px rgba(0,0,0,0.5) }
        .three_menu_item { color: #333; font-size: 13px; line-height: 1; display: block; padding: 10px 5px; border-bottom: 1px dashed #ccc;}
        .three_menu_item:last-child { border-bottom: none;}
        .three_menu_item:hover { color: #fff; background-color: #1e79be;}
        .submenu_item:hover .three_menu{ opacity: 1; left: 99%; visibility: visible;}


        .list_menu_box { position: relative;}
        .list_menu_item { width: 260px; padding: 20px 2px 20px 26px; border: 2px solid #eee; margin-bottom: 20px; font-size: 16px;}
        .list_menu_item > .submenu_item { color: #555; line-height: 30px; display: flex; align-content: center;}
        .list_menu_item > a i { font-size: 27px;line-height: 27px; margin-right: 10px; }

        .list_menu_three { width: 300px; position: absolute; left: 280px; top: 0;  z-index: 15; opacity: 0; visibility: hidden; text-align: center; border: 1px solid #eee; padding: 1px; }

.WB_arrow:before,.WB_arrow:after{ content: ""; width: 0; height: 0; position: absolute;display: block; border-width: 10px; border-style: solid;  }
.WB_arrow:before{ left: -20px; border-color: transparent #eee transparent transparent;}
.WB_arrow:after{ left: -19px; border-color: transparent white transparent transparent; margin-top: -18px;}
.WB_arrow[data-index='0']:before{ top: 28px;}
.WB_arrow[data-index='0']:after{ top: 46px;}
.WB_arrow[data-index='1']:before{ top: 120px;}
.WB_arrow[data-index='1']:after{ top: 138px;}
.WB_arrow[data-index='2']:before{ top: 208px;}
.WB_arrow[data-index='2']:after{ top: 226px;}
.WB_arrow[data-index='3']:before{ top: 122px;}
.WB_arrow[data-index='3']:after{ top: 140px;}

        .list_menu_item.active {background-color: #1992d8; color: #ffffff; }
        .list_menu_item.active > a { color: #ffffff; }
        .list_menu_item.active .list_menu_three { display: block; opacity: 1; visibility: visible;}
        .three_menu_item.active { background-color: #1992d8; color: #ffffff;}




.index_banner { max-height: 592px;}
.index_banner img { font-size: 0;}
.banner_bottom { width: 100%; background-color: #002750; }
.banner_bottom_inner { height: 135px; margin: auto;padding: 40px 50px 0;box-sizing: border-box; width: 70%;}
    .message_bar_icon { font-size: 24px; margin: 20px; color: #757587;}
.banner_bottom_innert {width: 100%;height: 58px; background-color: #fff; border-radius: 0px 4px 4px 0px;}
.banner_bottom_innerti1, .banner_bottom_innerti2 { line-height: 58px;height: 58px;border-left: 1px solid #000;border-left: 1px solid rgba(0, 0, 0, 0.1);padding: 0 18px;box-sizing: border-box;font-size: 16px;}
.banner_bottom_innerti1 {width: 30%;border-right: 1px solid #000;border-right: 1px solid rgba(0, 0, 0, 0.1);}
.banner_bottom_innerti2 {width: 30%;}
.banner_bottom_innert button { flex: auto; height: 58px;background: #ff822e;border-radius: 0px 4px 4px 0px;transition: all 0.3s;cursor: pointer;color: #fff;font-weight: bold;font-size: 16px; border: 0;}



.index_container {}
.index_big_title { text-align: center; margin: 60px auto 40px auto;}
    .index_title_en { color: #cbcbcb; font-size: 16px; margin-bottom: 17px;}
    .index_title_cn { color: #ab1e2a; font-size: 26px; position: relative; height: 26px; line-height: 1; display: inline-block; }
    .index_title_cn:before { content: ""; position: absolute; width: 33px; height: 1px; left: -60px; top: 13px; border-bottom: 1px solid #cccccc;}
    .index_title_cn:after { content: ""; position: absolute; width: 33px; height: 1px; right: -60px; top: 13px; border-bottom: 1px solid #cccccc;}

    .bold_title_en { color: #3e3e3e; font-size: 24px; font-weight: bold; line-height: 1.5; text-transform: uppercase;}
    .bold_title_cn { color: #3e3e3e; font-size: 28px; font-weight: bold; line-height: 1.5;}
    .bold_title_en.dark { color: #ffffff;}
    .bold_title_cn.dark { color: #ffffff;}

    .honer_container { background: url('honor_bg.jpg') no-repeat center center; background-size: cover; padding: 10px 0 50px 0; }
    .honer_container .bold_title_en,.honer_container .bold_title_cn  { color: #fff;}




    .index_intro_company { }
    .index_intro_company p { font-size: 16px; line-height: 1.5; margin-bottom: 1em; text-align: justify; }

    .index_business { text-align: center;}
    .business_item { display: inline-block; vertical-align: top; width: 350px; height: 350px; background-color: #ffffff; box-shadow: 0 0 7px #aaa; padding: 38px 32px; border-radius: 10px; text-align: center; margin: 0 10px;}
        .business_item_icon { font-size: 40px; width: 88px; height: 88px; line-height: 1; overflow: hidden; border-radius: 50%; color: #fff; background-color: #0079ff; padding: 24px;}

    .index_special { background: url("index-bg1.jpg") no-repeat top center; color: #fff; height: 725px; }

    .index-ys {position: relative; text-align: center; line-height: 1;}
    .index-ys .lists { max-width: 1160px; height: 300px; margin: 0 auto; margin-top: 20px; position: relative; }
    .index-ys ul li { width: 205px; height: 205px; background: rgba(1, 87, 173, .6); border: solid 1px #59a6ef; float: left; transform: rotate(45deg); position: absolute; transition: background-color 0.5s ease; -moz-transition: background-color 0.5s ease; -webkit-transition: background-color 0.5s ease; -ms-transition: background-color 0.5s ease; -o-transition: background-color 0.5s ease; }
    .index-ys ul li:hover { background: #d8972e; color: #fff; }
    .index-ys ul li .box { width: 100%; height: 100%; padding: 5% 10%; cursor:context-menu; transform: rotate(-45deg) }
    .index-ys ul li .box i { min-height: 60px; line-height: 60px; vertical-align: middle; }
    .index-ys ul li .box h3 { font-size: 16px; font-weight: bold; line-height: 24px; }
    .index-ys ul li .box .con { padding-top: 12px; font-size: 13px; height: 78px; line-height: 22px; overflow: hidden; color: #bdd5fd; }
    .index-ys ul li:hover .con { color: #fff; }
    .index-ys ul li:nth-child(1) { left: 42px; top: 42px }
    .index-ys ul li:nth-child(2) { left: 332px; top: 42px }
    .index-ys ul li:nth-child(3) { left: 622px; top: 42px }
    .index-ys ul li:nth-child(4) { left: 912px; top: 42px }
    .index-ys ul li:nth-child(5) { left: 187px; top: 186px }
    .index-ys ul li:nth-child(6) { left: 477px; top: 186px }
    .index-ys ul li:nth-child(7) { left: 767px; top: 186px }

    .index_person { }
        .person_item { display: inline-block; width: 286px; height: 475px; border-radius: 10px; background-color: #ffffff; text-align: center; margin: 0 5px; vertical-align: top;}
            .person_avatar { border-radius: 10px 10px 0 0; overflow: hidden; max-height: 286px; }


.friend_list{ padding: 0; width: 1160px;  margin: 0px auto;}
.friend_line1{position: relative;right: -9px;bottom: 1px;top: 8px;}
.friend_line2{position: relative;right: -90px;bottom: 1px;top: -28px;}
.friend_line3{position: relative;right: -9px;bottom: 1px;top: -63px;}
.friend_line4{position: relative;right: -90px;bottom: 1px;top: -98px;}

.diamond{ line-height: 0; width: 110px;height: 110px;background: #ffffff;transform: rotate(-45deg);display: inline-block;vertical-align: middle;margin: 6px 25px 6px 25px; text-align: center;}
.diamond img{transform: rotate(45deg);position: relative;left: 0px;top: 14px; width: 74px; height: 74px;}




    .index_block_item { width: 375px; display: block;  position: relative;}
        .index_block_content { padding: 20px 29px;  }
        .index_block_item img { font-size: 0; width: 100%;}
            .index_block_sub { position: relative; font-size: 20px; height: 45px;}
            .index_block_sub:after { content: ""; position: absolute; left: 0; bottom: 4px; height: 1px; width: 38px; border-bottom: 3px solid #0086d4;}


    .index_case { height: 420px; margin-bottom: 60px;}
    .index_case .index_block_item { height: 390px;}
    .index_case .swiper-pagination { bottom: 0px;}
    .index_case .swiper-pagination-bullet { background-color: #ccc; width: 12px; height: 12px;}
    .index_case .swiper-pagination-bullet-active { background-color: #0086d4 !important;}

    .index_partner { padding: 0 30px;}
    .index_partner .swiper-button-next { color: #ddd; }
    .index_partner .swiper-button-prev { color: #ddd;}

    .index_news {}
    .index_news img { width: 378px; height: 282px;}
    .index_honer {
        --swiper-navigation-color: #fff;/* 单独设置按钮颜色 */
        --swiper-navigation-size: 30px;/* 设置按钮大小 */
        padding-left: 30px;
        padding-right: 30px;
    }
    .index_honer .swiper-button-prev { top: 80px; margin-top: 0; }
    .index_honer .swiper-button-next { top: 80px; margin-top: 0;}

    .index_honer img { height: 162px; object-fit: cover}
    .index_honer .index_block_item { height: 272px; transition: 300ms; transform: scale(0.8); opacity: 0.75;}
        .index_honer_content { padding: 10px; color: #fff; position: absolute; left: 0; bottom: 0; height: 110px; transition: 0.2s; text-align: center; opacity: 0;}
        /*.index_block_item:hover .index_honer_content { color: #fff; background-color: var(--site-color); height: 180px; }*/
        /*.index_block_item:hover .index_honer_content a { color: #fff; }*/
        .enter-arrow { background: url("enter-arrow.png") no-repeat;width: 30px; height: 7px; display: inline-block;}
        .index_intro_right { width: 680px; font-size: 0;}

.index_honer .swiper-slide-active,.swiper-slide-duplicate-active{
    transform: scale(1);
    opacity: 1;
}
.index_honer .swiper-slide-active .index_honer_content,.swiper-slide-duplicate-active .index_honer_content {
    opacity: 1;
}

.index_block_title { border-bottom: #888888 1px solid; }
.index_block_title span { display: inline-block; color: #4a4a4a; border-bottom: 2px #0b4793 solid; font-size: 16px; font-weight: bold; padding-bottom: 10px;}
.index_block_title a { float: right; margin-top: 7px; font-size: 13px;}

    .index_block_link { padding: 15px 0;}
    .index_block_link a { font-size: 14px; display: block; line-height: 2.4em; height: 2.4em; overflow: hidden;}
    .index_block_link a span { float: right; font-size: 13px; color: #777; margin-left: 10px;}

/*footer*/
.footer_container {  position: relative; font-size: 13px; line-height: 2.2; background: url("footer.jpg") top center; color: #ffffff; }
.footer_container a { color: #ffffff;}
    .footer_wrapper { background: url("footer.jpg") right center no-repeat; padding-top: 50px; padding-bottom: 50px;}

    .footer_classify { width: 720px;}
        .class_item { display: inline-block; vertical-align: top; margin-right: 40px;}
        .class_item:last-child { display: none;}
        .class_item a { display: block; font-size: 13px; color: #ccc;}
        .class_item a:first-child { font-weight: bold; color: #fff; font-size: 15px;}
        .footer_contact { font-size: 13px; color: #ccc; width: 300px;}
        .footer_contact div:first-child { font-weight: bold; color: #fff; font-size: 15px;}

        .footer_address { width: 160px; margin-right: 10px;}
        .footer_address:last-child { margin-right: 0;}
    .footer_qrcode { width: 140px; height: 140px; overflow: hidden; text-align: center}
    .footer_contact { width: 240px;}
    .footer_copyright { border-top: 1px solid #d2d2d2; padding: 16px 0; color: #777;}
    .footer_copyright a { color: #777;}


/*list*/
.list_banner {  height: 200px;}

    .list_position { color: #888;}

    .list_left { width: 300px; float: left; }
        .left_menu_box {  border-left: 1px solid #e7e7e7;  border-right: 1px solid #e7e7e7;  }
        .left_menu_title { background: #0e5a98; height: 54px; color: #ffffff; text-align: left;}
        .left_menu_title a { color: #fff !important; padding-left: 20px;}
        .left_menu_links {  border-bottom: 1px solid #e7e7e7;  }
        .left_menu_links a {  display: block; background: #ffffff; color: #0e5a98 ; height: 42px; line-height: 42px; font-size: 15px; text-align: left; transition-duration: 0s; padding-left: 20px;}
        .left_menu_links a.active {  color: #545d89; font-weight: bold;  }

        .left_menu_other { text-align: center;}
        .left_menu_other a { margin: 2px 0; display: inline-block;}

    .list_right { width: 830px; float: right; padding: 0;}
        .list_title { height: 40px; vertical-align: baseline; padding: 10px 0 0 20px; border-bottom: 2px solid #e7e7e7;}
            .list_title_icon { display: inline-block; background: url("list_title_icon.png") no-repeat; width: 5px; height: 17px; margin-right: 10px;}
            .list_title_text { display: inline-block; font-size: 16px; font-weight: bold; color: #112973;}
            .list_title_fix { display: inline-block; background: url("list_title_fix.png") no-repeat; width: 137px; height: 14px; margin-left: 10px;}

        .list_bordered { }
        .list_bordered a { padding-bottom: 20px; border-bottom: 1px solid #e7e7e7; margin-bottom: 20px; }
        .list_bordered a:last-child { border-bottom: none;}



.list_article { padding:15px 35px;}

.list_text { margin:0 auto; font-size:14px; line-height:1.75; position:relative; padding: 0 15px; }
.list_text p {}
.list_text h4 a { margin-top:10px;}
.list_text img { max-width:100%;}
.list_img_line { margin: 2em 0; border-bottom: 1px dashed #e7e7e7; padding-bottom: 2em; }

.list_link_text { padding: 20px;}
.list_link_text a { font-size: 14px; line-height: 3em; height: 3em; border-bottom: 1px dashed #e7e7e7; display: block;}
.list_link_text a:last-child { border-bottom: none;}
.list_link_text a span { float: right; color: #777; font-size: 13px;}

.list_search {}
.list_search .list_search_line { border-bottom: 1px dashed #e7e7e7; display: block; padding: 1.75em 0;}
.list_search .list_search_line:last-child { border-bottom: none;}

/*搜索页*/
.search_input { width: 100%; height: 3em; line-height: 3em; padding: 5px; border: 1px solid #999; border-radius: 4px;}
.search_btn { padding: 0.75em 1.2em; border-radius: 4px;}

/*内容页*/
.article_box {  border-radius:6px; min-height:580px; padding:30px 85px; line-height:24px; width: 65%; min-width: 700px; margin: 30px auto 30px auto; box-shadow: 0 0 5px #ccc;}

    .article_body { min-height:10em; text-align: justify; letter-spacing: 1px; padding: 30px 120px;}
    .article_body img { padding:4px; background:#fff; margin:1%; max-width:95%;}
    .article_body p { line-height: 1.5em; margin-bottom: 1.2em;}

    .article_new {}
    .article_new:before{ content: ' '; background: url("new.gif") no-repeat; height: 11px; width: 27px; display: inline-block; margin-right: 0.3em;}


/*左侧工具条*/
.icon-font {position: relative;}
.icon-font:after {content: "";width: 30px;height: 30px;background-image: url(icon_spirit.png);background-repeat: no-repeat;position: absolute;left: calc(50% - 15px);top: calc(50% - 15px);}

#toolbar {position: fixed;z-index: 9999;right: 17px;bottom: 10%;}
.toolbar_close {font-size: 18px;position: absolute;top: -30px;right: 0; cursor: pointer;}
#toolbar li {margin-bottom: 3px;font-size: 0;width: 57px;height: 57px;right: 0;position: relative;}
#toolbar li a {display: block;position: absolute;z-index: 9;right: 0;top: 0;width: 57px;height: 57px;overflow: hidden;background: #292e39;-webkit-transition: all .5s ease;transition: all .5s ease;white-space: nowrap;font-size: 0;}

#toolbar li .icon-font {display: inline-block;vertical-align: middle;width: 57px;height: 57px;background-color: #d9d9d9;}
#toolbar li .icon-qq:after {background-position: 0 -150px;}
#toolbar li .icon-phone:after {background-position: 0 -90px;}
#toolbar li .icon-ewm:after {background-position: 0 -30px;}
.ewm_content { position: absolute; right: 65px; top: 0; width: 140px; height: 140px; padding: 10px; background-color: #ffffff; display: none; opacity: 0; -webkit-transition: all 2.5s ease; transition: all 2.5s ease;}
.ewm:hover .ewm_content{ display: block; opacity: 1;}

#toolbar li .icon-message:after {background-position: 0 -120px;}
#toolbar li .icon-top:after {background-position: 0 -60px;}
#toolbar li .icon-wangwang:after {background-position: 0 0;}
#toolbar li .wz {display: inline-block;line-height: 57px;font-size: 14px;color: #fff;vertical-align: middle;padding-left: 10px;}
#toolbar li.backtop {cursor: pointer;}
#toolbar li.backtop .iconfont {color: #fff;background-color: #292e39;}
#toolbar li:hover a {width: 200px;}
#toolbar li:hover .icon-font {background-color: #292e39;}
#toolbar li:hover .icon-qq:after {background-position: -30px -150px;}
#toolbar li:hover .icon-phone:after {background-position: -30px -90px;}
#toolbar li:hover .icon-ewm:after {background-position: -30px -30px;}
#toolbar li:hover .icon-message:after {background-position: -30px -120px;}
#toolbar li:hover .icon-wangwang:after {background-position: -30px 0;}
#toolbar li:hover .icon-top:after {background-position: -30px -60px;}

@media (max-width: 990px) {
    #toolbar {display: none;}
}

/* =============自适应辅助============ */

@media only screen and (max-width: 767px){
    .page_max { max-width: 100%; width: 100%; min-height: 0;}
    .fully {  width: auto !important ;}
    .xs { width: 100%!important;}

    .fully {  width: auto !important ;}
    .xs { width: 100%!important;}
    .xs_hide { display: none;}
    .xs_show { display: block;}
    .xs_full { width: 100vw!important;}

    .list_article { padding: 22px;}
    .list_text { padding: 10px;}
    .list_left { display: none;}
    .list_right { width: 100% !important;}
    .list_title_text { display: none!important;}


    .pull-right { float: none; display: block; width: 100%;}
    .article_box { padding: 30px 30px; width: 100%;}
    .article_body { padding: 30px;}

    .top_logo { flex-wrap: wrap;}
    .list_img_line { margin: 0;}
    .list_img_line .pull-left { float: none; display: block; width: 100%;}

    .index_container { margin-top: 5px!important;}
    .index_block_content { flex-wrap: wrap;}
    .index_block_content > div { width: 100%!important; height: auto!important;}


    .index-ys ul li { position: static;}
    .index-ys {position: relative; text-align: center; line-height: 1;}
    .index-ys .lists { max-width: 1160px; height: auto; margin: 0 auto; margin-top: 20px; position: relative; }
    .index-ys ul { display: flex; flex-wrap: wrap; width: 85%; margin: 0 auto;}
    .index-ys ul li { width: 105px; height: 145px; background: rgba(1, 87, 173, .6); border: solid 1px #59a6ef; float: none; transform: unset; position: static; transition: background-color 0.5s ease;  }
    .index-ys ul li:hover { background: #d8972e; color: #fff; }
    .index-ys ul li .box { width: 100%; height: 100%; padding: 5% 10%; cursor:context-menu; transform: none }
    .index-ys ul li .box i { min-height: 60px; line-height: 60px; vertical-align: middle; }
    .index-ys ul li .box h3 { font-size: 16px; font-weight: bold; line-height: 24px; }
    .index-ys ul li .box .con { padding-top: 12px; font-size: 13px; height: 78px; line-height: 22px; overflow: hidden; color: #bdd5fd; }
    .index-ys ul li:hover .con { color: #fff; }
    .index-ys ul li:nth-child(1) { left: 42px; top: 42px }
    .index-ys ul li:nth-child(2) { left: 332px; top: 42px }
    .index-ys ul li:nth-child(3) { left: 622px; top: 42px }
    .index-ys ul li:nth-child(4) { left: 912px; top: 42px }
    .index-ys ul li:nth-child(5) { left: 187px; top: 186px }
    .index-ys ul li:nth-child(6) { left: 477px; top: 186px }
    .index-ys ul li:nth-child(7) { left: 767px; top: 186px }

    .person_item { width: 75%; height: auto; margin: 20px auto; display: block;}

    .friend_list{ padding: 0; width: 100%;  margin: 0px auto; margin-left: 6px;}
    .friend_line1{position: relative;right: 0;bottom: 1px;top: 0px;}
    .friend_line2{position: relative;right: 0;bottom: 1px;top: 0px;}
    .friend_line3{position: relative;right: 0;bottom: 1px;top: 0px;}
    .friend_line4{position: relative;right: 0;bottom: 1px;top: 0px;}

    .diamond{ transform: unset; width: 30%; margin: 2px;}
    .diamond img{transform: unset;}

    .banner_bottom_inner { width: 100%;}

    .footer_wrapper { padding-left: 10px; padding-right: 10px;}


}



/*========网页端组件复制========*/

/*table增强-复制于bootstrap*/
/*table{border-spacing:0;border-collapse:collapse}*/
/*td,th{padding:0}*/
.table{width: 100%;max-width: 100%;margin-bottom: 20px; border-spacing:0;border-collapse:collapse}
.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th{padding: 8px;line-height: 1.42857143;vertical-align: top;border-top: 1px solid #ddd}
.table>thead>tr>th{vertical-align: bottom;border-bottom: 2px solid #ddd}
.table>caption+thead>tr:first-child>td,.table>caption+thead>tr:first-child>th,.table>colgroup+thead>tr:first-child>td,.table>colgroup+thead>tr:first-child>th,.table>thead:first-child>tr:first-child>td,.table>thead:first-child>tr:first-child>th{border-top: 0}
.table>tbody+tbody{border-top: 2px solid #ddd}
.table .table{background-color: #fff}
.table-bordered{border: 1px solid #ddd}
.table-bordered>tbody>tr>td,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>td,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>thead>tr>th{border: 1px solid #ddd}
.table-bordered>thead>tr>td,.table-bordered>thead>tr>th{border-bottom-width: 2px}
.table-striped>tbody>tr:nth-of-type(odd){background-color: #f9f9f9}
.table-hover>tbody>tr:hover{background-color: #f5f5f5}
.table>tbody>tr.active>td,.table>tbody>tr.active>th,.table>tbody>tr>td.active,.table>tbody>tr>th.active,.table>tfoot>tr.active>td,.table>tfoot>tr.active>th,.table>tfoot>tr>td.active,.table>tfoot>tr>th.active,.table>thead>tr.active>td,.table>thead>tr.active>th,.table>thead>tr>td.active,.table>thead>tr>th.active{background-color: #f5f5f5}
.table-hover>tbody>tr.active:hover>td,.table-hover>tbody>tr.active:hover>th,.table-hover>tbody>tr:hover>.active,.table-hover>tbody>tr>td.active:hover,.table-hover>tbody>tr>th.active:hover{background-color: #e8e8e8}

/*组件样式覆盖*/
.swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff;}

/*message 组件*/
.message_box { width: 540px;}
.message_line { padding: 4px 0;}
.message_line h3 { line-height: 2.2em; font-size: 1.2rem;}
.message_line input { border: 1px solid #e4e4e4; background-color: #fff; height: 3em; padding:1em; font-size: 1rem; width: 100%; border-radius:3px;}
.message_line textarea { border: 1px solid #e4e4e4; background-color: #fff; height: 8em; line-height: 1.5em; padding:1em; font-size: 1rem; width: 100%; border-radius:3px;}
    .message_button { display: inline-block; color: #fff; border: 0; padding: 1em 1.8em; line-height: 1em; background-color: #00b0ff; border-radius: 6px; cursor: pointer;}

/*分页*/
.pagination {  display: inline-block;  padding-left: 0;  margin: 10px 0;  border-radius: 4px;  }
.pagination > li {  display: inline;  }
.pagination > li > a,.pagination > li > span {  position: relative;  float: left;  padding: 6px 12px;  margin-left: -1px;  line-height: 1.42857143;  color: #337ab7;  text-decoration: none;  background-color: #fff;  border: 1px solid #ddd;  }
.pagination > li:first-child > a,.pagination > li:first-child > span {  margin-left: 0;  border-top-left-radius: 4px;  border-bottom-left-radius: 4px;  }
.pagination > li:last-child > a,.pagination > li:last-child > span {  border-top-right-radius: 4px;  border-bottom-right-radius: 4px;  }
.pagination > li > a:hover,.pagination > li > span:hover,.pagination > li > a:focus,.pagination > li > span:focus {  z-index: 2;  color: #23527c;  background-color: #eee;  border-color: #ddd;  }
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover,.pagination > .active > span:hover,.pagination > .active > a:focus,.pagination > .active > span:focus {  z-index: 3;  color: #fff;  cursor: default;  background-color: #337ab7;  border-color: #337ab7;  }
.pagination > .disabled > span,.pagination > .disabled > span:hover,.pagination > .disabled > span:focus,.pagination > .disabled > a,.pagination > .disabled > a:hover,.pagination > .disabled > a:focus {  color: #777;  cursor: not-allowed;  background-color: #fff;  border-color: #ddd;  }
.pagination {text-align:center; }
.pagination li, .pagination li a { _display:inline-block; _display:inline; color:#666;}
.pagination .active a { background:#4c6185; border:1px solid #4c6185; color:#fff;}
.pagination .active a:hover, .pagination .active a:active,.pagination .active a:focus { background:#4c6185; border:1px solid #4c6185;}


/* 间距快捷设置，复制于vuetify，使用方法：ml-3  ma-5  pa-5 m/p[方向]-数值 */
.ma-auto{margin-top:auto!important;margin-right:auto!important;margin-bottom:auto!important;margin-left:auto!important}.my-auto{margin-top:auto!important;margin-bottom:auto!important}.mx-auto{margin-left:auto!important;margin-right:auto!important}.mt-auto{margin-top:auto!important}.mr-auto{margin-right:auto!important}.mb-auto{margin-bottom:auto!important}.ml-auto{margin-left:auto!important}.ma-0{margin:0 0!important}.my-0{margin-top:0!important;margin-bottom:0!important}.mx-0{margin-left:0!important;margin-right:0!important}.mt-0{margin-top:0!important}.mr-0{margin-right:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.pa-0{padding:0 0!important}.py-0{padding-top:0!important;padding-bottom:0!important}.px-0{padding-left:0!important;padding-right:0!important}.pt-0{padding-top:0!important}.pr-0{padding-right:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.ma-1{margin:4px 4px!important}.my-1{margin-top:4px!important;margin-bottom:4px!important}.mx-1{margin-left:4px!important;margin-right:4px!important}.mt-1{margin-top:4px!important}.mr-1{margin-right:4px!important}.mb-1{margin-bottom:4px!important}.ml-1{margin-left:4px!important}.pa-1{padding:4px 4px!important}.py-1{padding-top:4px!important;padding-bottom:4px!important}.px-1{padding-left:4px!important;padding-right:4px!important}.pt-1{padding-top:4px!important}.pr-1{padding-right:4px!important}.pb-1{padding-bottom:4px!important}.pl-1{padding-left:4px!important}.ma-2{margin:8px 8px!important}.my-2{margin-top:8px!important;margin-bottom:8px!important}.mx-2{margin-left:8px!important;margin-right:8px!important}.mt-2{margin-top:8px!important}.mr-2{margin-right:8px!important}.mb-2{margin-bottom:8px!important}.ml-2{margin-left:8px!important}.pa-2{padding:8px 8px!important}.py-2{padding-top:8px!important;padding-bottom:8px!important}.px-2{padding-left:8px!important;padding-right:8px!important}.pt-2{padding-top:8px!important}.pr-2{padding-right:8px!important}.pb-2{padding-bottom:8px!important}.pl-2{padding-left:8px!important}.ma-3{margin:16px 16px!important}.my-3{margin-top:16px!important;margin-bottom:16px!important}.mx-3{margin-left:16px!important;margin-right:16px!important}.mt-3{margin-top:16px!important}.mr-3{margin-right:16px!important}.mb-3{margin-bottom:16px!important}.ml-3{margin-left:16px!important}.pa-3{padding:16px 16px!important}.py-3{padding-top:16px!important;padding-bottom:16px!important}.px-3{padding-left:16px!important;padding-right:16px!important}.pt-3{padding-top:16px!important}.pr-3{padding-right:16px!important}.pb-3{padding-bottom:16px!important}.pl-3{padding-left:16px!important}.ma-4{margin:24px 24px!important}.my-4{margin-top:24px!important;margin-bottom:24px!important}.mx-4{margin-left:24px!important;margin-right:24px!important}.mt-4{margin-top:24px!important}.mr-4{margin-right:24px!important}.mb-4{margin-bottom:24px!important}.ml-4{margin-left:24px!important}.pa-4{padding:24px 24px!important}.py-4{padding-top:24px!important;padding-bottom:24px!important}.px-4{padding-left:24px!important;padding-right:24px!important}.pt-4{padding-top:24px!important}.pr-4{padding-right:24px!important}.pb-4{padding-bottom:24px!important}.pl-4{padding-left:24px!important}.ma-5{margin:48px 48px!important}.my-5{margin-top:48px!important;margin-bottom:48px!important}.mx-5{margin-left:48px!important;margin-right:48px!important}.mt-5{margin-top:48px!important}.mr-5{margin-right:48px!important}.mb-5{margin-bottom:48px!important}.ml-5{margin-left:48px!important}.pa-5{padding:48px 48px!important}.py-5{padding-top:48px!important;padding-bottom:48px!important}.px-5{padding-left:48px!important;padding-right:48px!important}.pt-5{padding-top:48px!important}.pr-5{padding-right:48px!important}.pb-5{padding-bottom:48px!important}.pl-5{padding-left:48px!important}




